<template>
  <el-dialog v-model="visible"  :width="'30%'" :title="!dataForm.id ? '新增' : '修改'" :close-on-click-modal="false"
             :close-on-press-escape="false">
    <el-form :model="dataForm" :rules="rules" ref="dataFormRef" @keyup.enter="dataFormSubmitHandle()"
             label-width="120px">
      <el-input v-model="dataForm.isExamine" style="display:none;"></el-input>
      <el-row :gutter="22">
        <el-col :span="22">
          <el-form-item label="项目名称" >
            <span>{{dataForm.name}}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="22">
        <el-col :span="22">
          <el-form-item label="所属区域" prop="">
              <span>{{dataForm.provinceName}}</span>-<span>{{dataForm.cityName}}</span>-<span>{{dataForm.creaName}}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="22">
        <el-col :span="22">
          <el-form-item label="备注信息" >
            <span>{{dataForm.notes}}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="22">
        <el-col :span="22">
          <el-form-item label="项目负责人" prop="provinceId">
            <span>{{dataForm.projectHead}}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="22">
        <el-col :span="22">
          <el-form-item label="验收审核：" prop="examineState">
            <el-select clearable v-model="dataForm.examineState" placeholder="请选择项目审核状态">
              <el-option v-for="item in dataForm.examineStateOP" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="22">
        <el-col :span="22">
          <el-form-item label="验收信息" prop="examineNotes">
            <el-input
              resize="vertical"
              size="100"
              type="textarea"
              placeholder="请输入验收信息"
              v-model="dataForm.examineNotes"
              maxlength="100"
              show-word-limit
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <template v-slot:footer>
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmitHandle()">确定</el-button>
    </template>
  </el-dialog>
</template>

<script lang="ts" setup>
import {reactive, ref} from "vue";
import baseService from "@/service/baseService";
import {ElMessage} from "element-plus";
import {IObject} from "@/types/interface";

const emit = defineEmits(["refreshDataList"]);

const visible = ref(false);
const dataFormRef = ref();

const dataForm = reactive({
  id: '',
  name: '',
  provinceName: '',
  provinceId: '',
  cityName: '',
  cityId: '',
  creaName: '',
  creaId: '',
  projectHead: '',
  projectMember: '',
  createDate: '',
  state: '',
  isExamine:"",
  notes: '',
  examineState:"",
  examineNotes:"",
  examineStateOP:[{"value":1,"label":"待验收"},{"value":2,"label":"验收通过"},{"value":3,"label":"验收驳回"}],
  provinceURL: "/sysproject/address/getLevel",
  cityURL: "/sysproject/address/getParentId",
});
const rules = ref({
  examineState: [
    {required: true, message: '请选择验收审核状态', trigger: 'blur'}
  ],
});
const init = (row?: Object) => {
  debugger
  dataForm.id = "";
  dataForm.name ="";
  debugger
  Object.assign(dataForm, row);
  dataForm.isExamine ="1";
  // 重置表单数据
  if (dataFormRef.value) {
    dataFormRef.value.resetFields();
  }
  visible.value = true;
};

// 表单提交
const dataFormSubmitHandle = () => {
  debugger
  dataFormRef.value.validate((valid: boolean) => {
    if (!valid) {
      return false;
    }
    (!dataForm.id ? baseService.post : baseService.put)("/sysproject/project", dataForm).then((res) => {
      ElMessage.success({
        message: '成功',
        duration: 500,
        onClose: () => {
          visible.value = false;
          emit("refreshDataList");
        }
      });
    });
  });
};

defineExpose({
  init
});
</script>
